<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title></title>
	<script>
		function reg() {
			//0.收集填入的信息
			var $fid = fid.value;
			var $fname = fname.value;
			//非空验证
			if (!$fid) {
				alert("编号不能为空");
				return;
			}

			if (!$fname) {

				alert("名称不能为空");
				return;
			}

			//1.创建xhr异步对象
			var xhr = new XMLHttpRequest();
			//2.创建请求,打开连接
			xhr.open("POST", `/laptop_family/v1/laptop_family_reg`, true)
			//3.发送请求
			//3.1创建请求主体
			var formdata = `fid=${$fid}&fname=${$fname}`
			//3.2设置请求头信息
			xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded")
			xhr.send(formdata);
			//4.接收响应
			xhr.onreadystatechange = function () {

				if (xhr.readyState == 4 && xhr.status == 200) {
					var r = xhr.responseText;
					console.log(r)
					if (r == 1) {
						d1.innerHTML = "添加成功"
					} else {
						d1.innerHTML = "添加失败"
					}
				}
			}
		}
	</script>
</head>

<body>
	<input type="text" id="fid">类别编号<br>
	<input type="text" id="fname">类别名称<br>
	<button onclick="reg()">添加</button>
	<div id="d1"></div>
</body>

</html>